<script setup>
	import Back from '@/components/Back.vue'
</script>

<template>
	<view class="container">
		<image src="/static/images/bg.png" class="bg"></image>
		<view class="title">
			光生物调节仪使用说明
		</view>
		<view class="content">
			<view class="function-section">
				<view class="section-title">按键功能</view>
				<view class="function-item">
					1.&nbsp;长按开关键3秒开机，光源亮起后佩戴在眼部，眼睛直视前方。(默认持续时间为10分钟)
				</view>
				<view class="function-item">
					2.&nbsp;点按一次开关键设置持续时间，持续时间分别为5分钟、10分钟、20分钟、30分钟，每点按一次更换一次，循环更换。每次更换发出语音提示"好的，小主人，已为您设定X分钟"
				</view>
				<view class="function-item">
					3.&nbsp;连按两次开关键设置亮度，亮度分3档，循环更换，每更换一档发出语音提示"好的，小主人，亮度已调低"、"好的，小主人，亮度已最高"、"好的，小主人，亮度已最亮"
				</view>
				<view class="function-item">
					4.&nbsp;开机状态下，长按开关键3秒关机。
				</view>
			</view>
			<view class="function-section">
				<view class="section-title">语音功能</view>
				<view class="function-item">
					1.&nbsp;<text class="text-bold">唤醒</text>："<text class="text-bold">小亮小亮</text>"或"<text
						class="text-bold">你好，小亮</text>"，回应："你好，小主人"(唤醒后15秒内无任何语音指令则自动待机)，待机后需重新唤醒。
				</view>
				<view class="function-item">
					2.&nbsp;<text class="text-bold">亮度调节</text>：唤醒后发出指令。①"<text class="text-bold">亮度减</text>"或"<text
						class="text-bold">调暗点</text>"，回应："好的，小主人，亮度已调低"(亮度已最低时回应："主人，亮度已最低")；②"<text class="text-bold">亮度加</text>"或"<text
						class="text-bold">调亮点</text>"，回应："好的，小主人，亮度已调高"(亮度已最高时回应："主人，亮度已最高")；③"<text class="text-bold">亮度最低</text>"，回应："好的，小主人，亮度已最低"；④"<text
						class="text-bold">亮度最高</text>"，回应："好的，小主人，亮度已最高"。
				</view>
				<view class="function-item">
					3.&nbsp;<text class="text-bold">定时调节</text>：唤醒后发出指令。①"<text class="text-bold">5分钟</text>"或"<text
						class="text-bold">定时5分钟</text>"(回应："好的，小主人，已为您定时5分钟")；②"<text class="text-bold">10分钟</text>"或"<text
						class="text-bold">定时10分钟</text>"(回应："好的，小主人，已为您定时10分钟")；③"<text class="text-bold">20分钟</text>"或"<text
						class="text-bold">定时20分钟</text>"(回应："好的，小主人，已为您定时20分钟")；④"<text class="text-bold">30分钟</text>"或"<text
						class="text-bold">定时30分钟</text>"(回应："好的，小主人，已为您定时30分钟")。
				</view>
				<view class="function-item">
					4.&nbsp;<text class="text-bold">关机</text>：唤醒后发出指令。"<text class="text-bold">关机</text>"，回应："好的，小主人，已关机"，之后进入待机状态。(待机状态下唤醒，需先给出开机指令后，才能使用其他语音功能)
				</view>
				<view class="function-item">
					5.&nbsp;<text class="text-bold">开机</text>：唤醒后发出指令。"<text class="text-bold">开机</text>"，回应："好的，小主人，已开机"。
				</view>
			</view>
		</view>
		<Back style="margin-top: 40rpx;" />
	</view>
</template>

<style lang="scss">
	.container {
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;

		:deep(.wd-picker__cell) {
			padding: 20rpx 10rpx !important;
			font-size: 40rpx;
			background-color: transparent !important;
		}
	}

	.content {
		// width: 100%;
		// margin-top: 40rpx;
		margin: 0 40rpx;
		padding: 20rpx 40rpx;
		border-radius: 20rpx;
		box-sizing: border-box;
		background-color: #f2f2f2;
	}

	.bg {
		width: 100%;
		height: 100%;
		position: fixed;
		background-size: 100% 100%;
		z-index: -10;
		/* 置于底层 */
	}

	.title {
		margin: 10rpx 0 30rpx;
		font-size: 34rpx;
		font-weight: bold;
		padding: 30rpx;
		border-bottom: 1px solid #8d8d8d;
	}

	.function-section {
		margin-bottom: 30rpx;
	}

	.section-title {
		font-size: 28rpx;
		line-height: 60rpx;
		// font-weight: bold;
		// margin-bottom: 30rpx;
	}

	.function-item {
		font-size: 24rpx;
		margin-bottom: 10rpx;
	}

	.text-bold {
		font-weight: bold;
	}
</style>